import React, { forwardRef, useState, useImperativeHandle, ChangeEvent, useRef } from 'react';
import { Button, Modal, Input, Table, Space, Form, Pagination, Select, Radio, Image, Upload, DatePicker, Divider, DatePickerProps, TreeSelect, Switch } from 'antd';
import { FontSizeOutlined, PayCircleOutlined, BankOutlined, DesktopOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';
import { deepClone, deepCopy, formatTime, formatYear, getChangeEventValue, provinceList } from '../../../utils';
import systemApi from '../../../api/system';
import { DocInstance, ProtectlandBaseInfoType, ProtectlandType } from '../../../utils/types';
import Link from 'antd/es/typography/Link';

interface Props {
    onFinish?: Function
}

const FilePreviewModal = (props: Props, ref: any) => {
    useImperativeHandle(ref, () => ({
        openModal: openModal
    }))

    const {
        onFinish
    } = props;

    const [submitLoading, setSubmitLoading] = useState(false);
    const [isModalOpen, setIsModalOpen] = useState(false);
    const [fileUrl, setFileUrl] = useState<string>('');

    const handleConfirm = async () => {

    };

    const handleCancel = () => {
        setIsModalOpen(false);
    };


    const openModal = (fileUrl: string) => {
        setIsModalOpen(true);
        setFileUrl(fileUrl);
    }

    return (
        <Modal
            title={'文稿预览'}
            open={isModalOpen}
            okButtonProps={{
                style: { display: 'none' }
            }}
            onCancel={handleCancel}
            cancelText={'关闭'}
            width={812}
            maskClosable={false}
            confirmLoading={submitLoading}
            centered
        >
            {
                fileUrl
                &&
                <iframe
                    src={`https://view.xdocin.com/view?src=${encodeURIComponent(fileUrl)}&toolbar=true`}
                    width="100%"
                    style={{ height: '80vh', border: '1px solid #eee', backgroundColor: '#fff' }}
                ></iframe>
            }
        </Modal>
    )
}

export default forwardRef(FilePreviewModal)